跳到主要内容

2.2-React 面试题

框架基础篇​

你简历里是React和Vue都会，那先说说你是怎么看这两个框架的把

对 React 和 Vue 的看法​

在开发模式上，React发明了JSX这种开发模式，并且用了很多年时间让社区去接受，而Vue则是采用现成的模版语法的开发模式。但感觉就这两年这两个框架都在往一个函数式组件的方向靠，不应该说靠是已经实现了，Vue3中的函数式组件甚至在某种层面上说比react更自由。当然洛现在声明式的编程是主流嘛

“在实现层面上说的话，就那一套，单向数据流，双向绑定，数据不可变性，更智能的依赖收集，优化的方式不同等”

“听到你说了更自由和智能的依赖收集，具体指的是？”

"比如react useEffect要手动加依赖，但vue3的wachEffect和computed就不用"。

“自由，em就比如，hook得顶层，不要条件循坏用，而且react重心智负担：就闭包陷阱那一套过时变量嘛，依赖的选择，还有重复渲染这些问题，我一直不理解为什么不把这些心智负担收到框架里，我觉得react是有这个能力的。vue3的话，你想咋用咋样api咋样，setup也会只用一次，也不会像新旧树对比hook多次调用”

“哈哈感觉你对 react 怨气好大，因为我看你文章写了很多 react 源码的嘛，如果是你你会怎么去收敛这个心智负担到框架内部？”

就是 hook 顶层那个和条件循坏应该不好动，因为 react 不能去破坏 hooks 链表的结构，对于过时变量react18已经将usestate全改为异步了，依赖的选择的心智问题我觉得是否说可以更明确一点再未来加入配置项的话，将依赖的收集在 updateEffect 和 mountedEffect 前去提前收集，就做一个依赖系统专门去处理这个事情，感觉可以从编译器自动生成依赖数组，现在 react 只是一层浅比较。但其实这么想，大部分问题的根源，是React函数组件机制所限：每次组件渲染，组件里的所有代码都会被重新调用一次，在这上面其实也可以动下手（自己说了感觉当没说，感觉好尴尬啊硬吹）。就长话短说就是，react的心智模型让我要花很多精力去处理边界情况。

“其实你最后句话说得挺好的，因为react要求你用声明式的方式去写组件，你就不该去纠结引用会不会变，多添加个依赖很不舒服，重新渲染这种事情，你需要保证的是无论重新渲染多少次这个组件都不会变。假设你useEffect依赖于AB，但你的B就可能只在首次创建后永远不变，它确实显得很“多余”但你不用纠结这个。真正的问题可能就在于你觉得的永远不会变只是你觉得，我们平时出现问题很多都是这种以为的边界问题导致B变造成的”

为什么react需要合成事件​

“兼容性的考虑把，可以抹平不同浏览器事件对象差异，还有个就是避免了垃圾回收。”

“我们公司主要是Vue，你的简历里Vue也更擅长一些，我们谈一下Vue把”

生命周期​

随便了一下，每个生命周期，父子生命周期，每个生命周期的定义和写法。

路由​

指令​

响应式原理​

数组处理​

key,diff算法​

V3组合式API​

一些TS系统​

V3编译原理​

“上面也问了挺多的了，你讲讲Vue3里面的模版编译和函数式组件编译把。”

“（我崩不住了，妈妈我想回家）先巴拉巴拉扯了一下pnpm和menorepo和整体v3源码，然后讲到complier,同样vue模版的编译也是通俗流程就是parse transform gen，我没具体研究过，但parse应该也是对标签属性文本指令等一系列做处理去干成AST，然后transform做转换最后生成。”

“行上午先面到这，二面通知你，有什么要问的吗？”

em，你觉得我咋样（我好直白~）

“挺不错的，2年经验，感觉你知识的掌握程度大于你的年限，有点好奇平时你怎么安排学习时间的”

“就可能目前这家公司比较清闲把，再加上学习写代码对我比较快乐，就能投入很多时间和精力，哎，就二面能不能快点！可以加个微信吗~”

参考文章​

作者链接
Big shark@LXhttps://juejin.cn/post/7004638318843412493
haizlinhttps://github.com/haizlin/fe-interview
溪饱鱼年后被吊打的第一面